<template>
    <view class="comment">
        <up-form :model="form" labelWidth="90px">
            <ssection line title="对企业评价">
                <view>
                    <up-form-item label="装车效率">
                        <up-rate :count="5" v-model="form.loadingEfficiency" size="20" :readonly="mode === 1"></up-rate>
                        <view class="ratetxt">{{ loadingEfficiencyTxt }}</view>
                    </up-form-item>
                    <up-form-item label="货物安全">
                        <up-rate :count="5" v-model="form.cargoSafe" size="20" :readonly="mode === 1"></up-rate>
                        <view class="ratetxt">{{ cargoSafeTxt }}</view>
                    </up-form-item>
                </view>
            </ssection>
            <ssection title="评价详情" line>
                <up-textarea v-model="form.content" placeholder="请输入描述详情" :maxlength="1000" autoHeight
                    :disabled="mode === 1"></up-textarea>
            </ssection>
        </up-form>
        <up-button type="primary" @click="submit" style="width: 90%;position: fixed;left: 5%;bottom: 50px"
            :disabled="mode === 1">提交</up-button>
    </view>
    <up-toast ref="uToastRef"></up-toast>
</template>

<script lang="ts" setup>
import { ref, reactive, computed, nextTick } from "vue"
import { onLoad } from "@dcloudio/uni-app"
import ssection from "@/components/ssection.vue"
import { saveComment, getComment } from "@/api/driver"



/* 数据 */
const uToastRef = ref<any>(null)
const mode = ref(0)
const form = reactive({
    targetId: '',
    loadingEfficiency: 3,
    cargoSafe: 3,
    content: ''
})
const ratetxt = reactive(['非常差', '差', '一般', '好', '非常好'])
const loadingEfficiencyTxt = computed(() => {
    return ratetxt[form.loadingEfficiency - 1]
})
const cargoSafeTxt = computed(() => {
    return ratetxt[form.cargoSafe - 1]
})


/* 方法 */
// 提交评价
const submit = async () => {
    uToastRef.value.show({
        message: '提交中...',
        type: 'loading',
        duration: -1
    })
    let res = await saveComment(form)
    uToastRef.value.hide()
    if (res.success) {
        uToastRef.value.show({
            message: '评价成功',
            type: 'success',
            position: 'top',
            complete() {
                uni.navigateBack()
            }
        })
    }
}
// 获取评价
const getComments = async () => {
    uToastRef.value.show({
        message: '加载中...',
        type: 'loading',
        duration: -1
    })
    let res = await getComment({ targetId: form.targetId })
    uToastRef.value.hide()
    if (res.success) {
        if (res.data.length > 0) {
            mode.value = 1
            Object.assign(form, res.data[0])
        } else {
            mode.value = 0
        }
    }
}



/* 钩子 */
onLoad(async (options: any) => {
    form.targetId = options.billId
    await nextTick()
    await getComments()
})




</script>

<style lang="scss" scoped>
.comment {
    min-height: calc(100vh - 45px);
    background-color: #fff;
    padding: 10px;

    .ratetxt {
        padding-left: 20px;
    }
}
</style>
